<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<title>滴答办公系统-学员列表</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="/media/layui/css/layui.css" media="all">
<script src="/media/js/jquery.min.js"></script>
	<script type="text/javascript">
		//根据数字跳转界面
		function gopage(pageindex,pagesize) {
			 // alert(pageindex+"  "+pagesize)
			$("#ff").prop("action","/student_list?pageIndex="+pageindex+"&pagesize="+pagesize);
			$("#ff").submit();
		}

		function jumppage(pagecount,pagesize) {
			var num= $("#pagenum").val();
			var regex = /^[1-9]\d*$/;
			if (regex.test(num) == true) {
				//alert("是一个数字~");
				if (num >= 1 && num <= pagecount) {
					location.href = "/student_list?pageIndex=" + num + "&pagesize=" + pagesize;
				} else {
					alert("请输入一个合法的数字!")
				}
			} else {
				alert("请输入一个数字!")
			}
		}
		//修改每页显示的数据
		function changepagesize(pagesize) {
			$("#ff").prop("action","/student_list?pageIndex=1&pagesize="+pagesize);
			$("#ff").submit();
			// location.href="/student_list?pageIndex=1&pagesize="+pagesize;
		}
		function exportexcell() {
			$("#ff").prop("action","/student_exportexcell");
			$("#ff").submit();
		}
	</script>
</head>
<body>
<form action="/student_list?pageIndex=1&pagesize=5" method="post" id="ff">
<div class="layui-container">
    <div class="layui-row" style="margin-top: 10px">
        <div class="layui-col-xs3" style="margin-right: 20px">
            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">姓名：</label>
                <div class="layui-input-block">
                    <input type="text" name="name" id="no" class="layui-input" placeholder="学生姓名" th:value="${name}">
                </div>
            </div>
        </div>
        <div class="layui-col-xs3" style="margin-right: 20px">
            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">班级：</label>
                <div class="layui-input-block">
                    <select class="layui-input" id="fg" name="classId" >
                        <option value="0">全部班级</option>
<!--                        <option value="2">JAVA1806班</option>-->
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-col-xs2">
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" type="submit"><i class="layui-icon layui-icon-search">搜索</i></button>
                </div>
            </div>
        </div>
        <div class="layui-col-xs2">
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <a class="layui-btn layui-btn-mini layui-btn-mini" href="javascript:exportexcell()" lay-event="detail">导出Excel</a>
                </div>
            </div>
        </div>
    </div>
</div>
</form>
	<div class="layui-container">
		<table class="layui-table" id="tbdata" lay-filter="tbop">
			<thead>
				<tr>
					<td>学号</td>
					<td>姓名</td>
					<td>班级</td>
					<td>性别</td>
					<td>手机号</td>
					<td>邮箱</td>
					<td>操作</td>
				</tr>
			</thead>
			<tbody>
				<tr th:id="|tr_${num.id}|" th:each="num:${studentutils.recods}">
					<td th:text="${num.id}">01</td>
					<td th:text="${num.name}">老王</td>
					<td th:text="${num.tclass.className}">JAVAEE</td>
					<td th:text="${num.sex}">女</td>
					<td th:text="${num.phone}">1336789100</td>
					<td th:text="${num.email}">23423@qq.com</td>
					<td><a class="layui-btn layui-btn-mini" href="studentupdate.html">编辑</a>
						<a class="layui-btn layui-btn-mini layui-btn-mini" href="studentdetails.html" lay-event="detail">查看详情</a>
						<a class="layui-btn layui-btn-danger layui-btn-mini" lay-event="del" onclick="deleteCourse();">删除</a>
					</td>
				</tr>
			</tbody>
		</table>
		<div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-1">
						   <a th:href="|javascript:gopage(${studentutils.pageIndex-1},${studentutils.pagesize})|" th:if="${studentutils.pageIndex>1}" class="layui-laypage-prev " data-page="0">
							    <i class="layui-icon">&lt;</i>
						   </a> 
<!--							    <span style="color:#009688;font-weight: bold;">1</span> -->
							    <a th:each="num:${studentutils.numbers}" th:href="|/student_list?pageIndex=${num}&pagesize=${studentutils.pagesize}|" th:text="${num}" th:style="${studentutils.pageIndex==num}?'color:#009688;font-weight: bold;':''">>2</a>
<!--							    <a href="#">3</a>  -->
<!--							    <a href="#">4</a> -->
<!--							    <a href="#">5</a> -->
<!--							<a th:href="|/student_list?pageIndex=${studentutils.pageIndex+1}&pagesize=${studentutils.pagesize}|" th:if="${studentutils.pageIndex<studentutils.pagecount}" class="layui-laypage-next " data-page="2">-->
							<a th:href="|javascript:gopage(${studentutils.pageIndex+1},${studentutils.pagesize})|" th:if="${studentutils.pageIndex<studentutils.pagecount}" class="layui-laypage-next " data-page="2">
							    <i class="layui-icon">&gt;</i>
							</a> 
							<span class="layui-laypage-skip">到第
							   <input type="text" min="1" th:value="${studentutils.pageIndex}" class="layui-input" id="pagenum">页
								<button type="button" class="layui-laypage-btn" th:onclick="|jumppage(${studentutils.pagecount},${studentutils.pagesize})|">确定</button>
							</span> 
							<span class="layui-laypage-count">当前[[${studentutils.pageIndex}]]/[[${studentutils.pagecount}]]页  共 [[${studentutils.totalpage}]] 条</span>
							<span class="layui-laypage-limits"> 
							    <select lay-ignore="" onchange="changepagesize(this.value)" >
							        <option value="5" th:selected="${studentutils.pagesize==5}">5 条/页</option>
									<option value="10" th:selected="${studentutils.pagesize==10}">10 条/页</option>
									<option value="20" th:selected="${studentutils.pagesize==20}">20 条/页</option>
<!--									<option value="40">40 条/页</option>-->
<!--									<option value="50">50 条/页</option>-->
<!--									<option value="60">60 条/页</option>-->
<!--									<option value="70">70 条/页</option>-->
<!--									<option value="80">80 条/页</option>-->
<!--									<option value="90">90 条/页</option>-->
							</select>
							</span>
						</div>
	</div>
	
	<script src="/media/layui/layui.js"></script>
	
	<script type="text/javascript">
		//下拉框回显
		$(function () {
			$.getJSON("student_findclass",function (result) {
				for(var i=0;i<result.length;i++){
					// alert(result[i].id)
				$("#fg").append("<option value='"+result[i].id+"'>"+result[i].className+"</option>")
				}
				//下拉框回显
				// alert([[${classid}]])
				$("#fg").val([[${classid}]]);
			})
		})

	   function deleteCourse(){
		   layui.use('table', function() {
			   layer.confirm('是否确认删除学生?',function(index) {
				   layer.msg("删除成功", {icon : 6});
				   layer.msg("删除失败", {icon : 5});
			   });
		   });
	   }
	</script>
	
	
</body>
</html>